<template>
  <view class="flex justify-between gap-x-14 py-12" @click="toArticleDetail(data.id)">
    <view class="flex-1 flex flex-col justify-between">
      <view class="line-clamp-1">{{ data.title }}</view>
      <view>
        <view class="line-clamp-1 text-gray-400 text-xs">{{ data.contentTxt }}</view>
        <view class="flex justify-between datas-center mt-4 text-xs">
          <view>
            <text class="text-blue-400">#{{ data.category?.name }}</text>
            <text class="ml-10 text-gray-400">{{ data.lawyer?.name }}</text>
          </view>
          <view class="text-gray-400">{{ data.updated_at }}</view>
        </view>
      </view>
    </view>
    <image class="w-90 h-68 rounded" :src="data.cover" mode="aspectFill" />
  </view>
</template>

<script setup>
defineProps({
  data: {
    type: Object,
    default: () => ({}),
  },
});

function toArticleDetail(id) {
  uni.navigateTo({
    url: `/pages/article/detail?id=${id}`,
  });
}
</script>
